body{
    margin: 15px;
    font-family: sans-serif;
    background-color: #f0f8ff;
}

.btn{
    border: 2px solid var(--color,black);
    background-color: white;
    font-size: 1em;
    line-height: 2em;
    border-radius: 2px;
    margin-bottom: 5px;
    text-align: center;
}
.btn:hover{
    cursor: pointer;
    background-color: var(--color,white);
    color: white;
}
.btn.red{
    /* background-color:red; */
    --color: red;
}
.btn.yellow{
    /* background-color: yellow; */
    --color:yellow;
}
.btn.green{
    /* background-color: green; */
    --color: green;
}
.btn.orange{
    /* background-color: orange; */
    --color: orange;
}
.btn.teal{
    /* background-color: teal; */
    --color: teal
}
